<div class="hte-profile">
	<div class="hte-profile-inner">

	<div class="hte-profile-content ">
		<div id="profile-info" class="hte-profile-panel active" style="margin-top: 80px;text-align: center">
			<div class="hte-profile-face" style="margin-bottom: 25px;">
				<img alt="" src="images/account/face/default.png">
			</div>
			<h4>欢迎您：HteOS_Man</h4>
			<p>
				登录时间：2014-12-03 23:36
			</p>
			<p>当前位置：北京 - 北京</p>
		</div>
		<div id="profile-face-upload" class="hte-profile-panel">
			<div class="hte-profile-face" style="margin-bottom: 15px;">
				<img alt="" src="images/account/face/default.png">
			</div> 
			<iframe id="profile-face-upload-frame" name="profile-face-upload-frame" style="display: none;"></iframe>
			<form id="face-upload-form" action="${ctx}/account/face/upload" method="post" target="profile-face-upload-frame" enctype="multipart/form-data">
				<input id="profile-face-input" name="face" type="file"
					class="form-control" style="display: none">
				<div id="profile-face-name"
					style="margin-bottom: 10px;width: 100%;overflow: hidden;word-break:break-all"></div>
				<button id="selectFaceBtn" type="button" class="btn btn-default"
					style="margin-bottom:10px;">选择头像图片</button>
				<div id="face-upload-tip" style="margin-bottom:10px;"></div>
				<div id="upload-preloader"
					style="margin-bottom: 8px;display: none;width: 100%;">
					<div class="col-sm-12 col-xs-12 col-md-12"
						style="text-align: center;">
						<img alt="" src="images/preloader.gif" height="24px;">
					</div>
				</div>
				<div id="upload-buttons">
					<button id="faceUploadBtn" type="button" class="btn btn-success">
						上传</button>
					<button id="faceUploadCancelBtn" type="button"
						class="btn btn-danger">取消</button>
				</div>
			</form>
		</div>
	</div>
	<div class="hte-profile-footer row">
		<!-- <div id="profile-edit-action" class="col-md-4 col-sm-4 col-xs-4 hte-profile-action">
			<a href="#" style="text-decoration: none"><span class="glyphicon glyphicon-edit"></span>
				<br />个人信息
			</a>
		</div> -->
		<div id="profile-lock-action" class="col-md-6 col-sm-6 col-xs-6 hte-profile-action">
			<a href="#" style="text-decoration: none"><span class="glyphicon glyphicon-unchecked"></span>
				<br />锁定屏幕
			</a>
		</div>
		<div class="col-md-6 col-sm-6 col-xs-6 hte-profile-action">
			<a href="${ctx}/logout" style="text-decoration: none"><span
				class="glyphicon glyphicon-off"></span>
				<br />退出
			</a>
		</div>
	</div>
	</div>
</div>
<script type="text/javascript">
	(function() {
		
		var initCity = false;
		
		$("#profile-lock-action").click(function(){
			$.guard.lock();
		});
		
		$("#profile-face-input").change(function() {
			$("#profile-face-name").html($(this).val());
		});

		$("#faceUploadBtn").click(function(){
			if (!$("#profile-face-input").val()) {
				$("#face-upload-tip").html("请选择要上传的文件");
				return false;
			}
			$("#upload-buttons").hide();
			$("#upload-preloader").show();
			$("#face-upload-form").submit();
		});	
		
		$("#hte-profile-face-img").click(function(){
			$("#profile-face-input").click();
		});
		
		$("#profile-face-input").change(function(){
			$("#face-upload-form").submit();
		});
		
		$("#selectFaceBtn").click(function() {
			$("#profile-face-input").click();
		});

		$("#faceUploadCancelBtn").click(function() {
			$(".hte-profile-panel.active").fadeOut(function() {
				$(this).removeClass("active");
			});
			$("#profile-info").fadeIn(function() {
				$(this).addClass("active");
			});
		});

		$("#profile-edit-action").click(function() {
			$(".hte-profile-panel.active").fadeOut(function() {
				$(this).removeClass("active");
			});
			$("#profile-edit").fadeIn(function() {
				$(this).addClass("active");
			});
		});
		$("#profile-face-upload-action").click(function() {
			$(".hte-profile-panel.active").fadeOut(function() {
				$(this).removeClass("active");
			});
			$("#profile-face-upload").fadeIn(function() {
				$(this).addClass("active");
			});
		});

	})();
	function faceUploadSuccess() {
		/* $("#face-upload-tip").html("上传成功");
		$("#upload-buttons").show();
		$("#upload-preloader").hide();
		window.setTimeout(function() {
			$(".hte-profile-panel.active").fadeOut(function() {
				$(this).removeClass("active");
			});
			$("#profile-info").fadeIn(function() {
				$(this).addClass("active");
			}); */
			$(".hte-profile-face > img").attr("src", "${ACCOUNT.face}?_dc="+new Date().getTime());
			/* $("#face-upload-tip").html("");
			$("#profile-face-name").html("");
		}, 1000); */
	}

	function faceUploadFail(message) {
		HteOS.Messager.alert("HteOS提示","上传失败");
		$("#upload-buttons").show();
		$("#upload-preloader").hide();
		$("#face-upload-tip").html(message);
	}
</script>